<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>单位</title>
	<style type="text/css">
		html {
			font-size: 20px;
		}

		.box-1 {
			width: 600px;
			/*color: #fff;*/
			background: rgb(135, 203, 215);
			padding: 10px;
			margin-bottom: 20px;
		}

		.box-inner-px {
			width: 300px;
			/*color: #fff;*/
			background: rgb(241, 201, 204);
			margin-bottom: 10px;
		}

		.box-inner-percent {
			width: 50%;
			/*color: #fff;*/
			background: rgb(241, 201, 204);
		}

		.box-2 {
			width: 80%;
			/*color: #fff;*/
			background: rgb(135, 203, 215);
			padding: 10px;
			margin-bottom: 20px;
		}
	</style>
</head>
<body>
	<div class="box-1">
		<p>宽度为 600px</p>
		<div class="box-inner-px">
			宽度为 300px
		</div>
		<div class="box-inner-percent">
			宽度为 50%
		</div>
	</div>
	<div class="box-2">
		<p>宽度为 80%</p>
		<div class="box-inner-px">
			宽度为 300px
		</div>
		<div class="box-inner-percent">
			宽度为 50%
		</div>
	</div>
</body>
</html>

